import {Component, OnInit} from 'angular2/core';
import {Hero, HeroService} from './hero.service';
import {RouteParams, Router, ROUTER_DIRECTIVES} from 'angular2/router';

@Component({
  templateUrl: './app/hero/views/detail.html',
  directives: [ ROUTER_DIRECTIVES ],
  styleUrls: ['./app/hero/views/styles.css']
})
export class HeroDetailComponent implements OnInit {

  private hero: Hero;

  constructor(
    private _router: Router,
    private _routeParams: RouteParams,
    private _service: HeroService) {}

  ngOnInit() {
    let id = this._routeParams.get('id');
    this._service.getHero(id).then(hero => this.hero = hero);
  }

  gotoHeroes() {
    let heroId = this.hero ? this.hero.id : null;
    this._router.navigate(['Hero', {id: heroId, foo: 'foo'}]);
  }
}